<template>
<div class="content">
  <div class="touch-main-content">
    <!-- 量碰统计 -->
    <div class="point-condition module">
      <div class="common-head">
        <div class="common-sub-title">
          <img src="~assets/img/icon_data.png" alt="量碰统计">
          <span>量碰统计</span>
          <router-link tag="div" to="/touch_rule" class="point-rule"><span>活动规则</span><img src="~assets/img/icon_detail.png" alt="规则"></router-link>
        </div>
      </div>
      <div class="module-list module-long-border">
        <div class="common-item "><span>左区销售统计：</span><span class="num" v-text="lzone_day_sale+'元'"></span></div>
        <div class="common-item"><span>右区销售统计：</span><span class="num" v-text="rzone_day_sale+'元'"></span></div>
        <div class="common-item"><span>量碰收益：</span><span class="num" v-text="day_bonus+'元'"></span> <div class="more"><router-link to="/touch_total" tag="span" class="more">查看更多<img src="~assets/img/icon_arr_green.png" alt=""></router-link></div></div>
      </div>
    </div>
    <!-- 量碰信息  -->
    <div class="module">
      <div class="common-head">
        <div class="common-sub-title">
          <img src="~assets/img/icon_info.png" alt="培育统计">
          <span>量碰信息</span>
        </div>
      </div>
      <div class="prize common-item">
        <!-- <div class="item"><span>累计完成量碰:</span><span class="num" v-text="total_bonus+'元'"></span></div> -->
        <div class="item"><span>昨日量碰:</span><span class="num" v-text="yes_bonus+'元'"></span></div>
      </div>
    </div>
  </div>
</div>
</template>

<script>
import axios from 'axios'
import { apiPost } from 'src/common/api.js'
export default {
  data () {
    return {
      lzone_day_sale: 0,
      rzone_day_sale: 0,
      day_bonus: 0,
      yes_bonus: 0
    }
  },
  mounted () {
    this.getRecList()
  },
  methods: {
    getRecList () {
      apiPost('amount_touch',
        {}).then((res) => {
        if (res.status === 0) {
          let data = res.data
          console.log(data)
          this.lzone_day_sale = data.lzone_day_sale
          this.rzone_day_sale = data.rzone_day_sale
          this.day_bonus = data.day_bonus
          this.yes_bonus = data.yes_bonus
        } else {
          console.log(res.msg)
        }
      })
    }
  }
}
</script>

<style scoped lang='scss'>
  @import '~lib/reset.scss';
  .touch-main-content {
    margin-top: 10px;
    .common-head {
      padding: 0 16px;
      .common-sub-title {
        .point-rule {
          float: right;
          span {
            font-size: $font-15;
          }
          img {
            width: 24px;
            height: 24px;
            margin-left: 10px;
          }
        }
      }
    }
    .module-list {
      padding:0 16px 0 16px;
      .more {
        float: right;
        span {
          vertical-align: middle;
            img {
            height: 12px;
            margin-left: 10px;
          }
        }
      }
    }
    .module-long-border {
      border-bottom: 1px solid #e5e5e5;
      div:last-child {
        border-bottom: none;
      }
    }
  }
</style>
